<script setup>
import { getAdList } from '@/api/portal/ad';
import { onMounted, ref } from 'vue';

onMounted(() => {
    getAdList().then((result) => {
        console.log(result);
        if (result.code == 200) {
            let res = result.data;
            let arr = [];
            for (let i = 0; i < res.length; i++) {
                arr.push({
                    itemImageSrc: res[i].pic,
                    thumbnailImageSrc: res[i].pic,
                    alt: res[i].title,
                    title: res[i].title,
                    link: res[i].link
                });
            }
            images.value = arr;
        }
    });
});

const images = ref();
</script>

<template>
    <Galleria :value="images" :numVisible="1" containerStyle="width: 100%; border: 0; border-radius: 0;" :showThumbnails="false" :showIndicators="true" :changeItemOnIndicatorHover="true" :showIndicatorsOnItem="inside" :indicatorsPosition="position">
        <template #item="slotProps">
            <img :src="slotProps.item.itemImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block" />
        </template>
    </Galleria>
</template>
@/api/portal/ad
